<template>
  <section>
    <!--工具条-->
    <el-col :span="24" class="toolbar" style="padding-bottom: 0px;">
      <el-form :inline="true" :model="filters">
        <el-form-item>
          <el-input size="small" style="width:150px;" v-model.trim="filters.name" placeholder="文章名称"></el-input>
        </el-form-item>
        <el-form-item>
          <el-input size="small" style="width:150px;" v-model.trim="filters.productName" placeholder="产品名称"></el-input>
        </el-form-item>
        <el-form-item>
          <el-select size="small" clearable style="width:150px;" v-model="filters.riskCode" placeholder="产品类型">
            <!-- <el-option label="全部产品类型"  value="-1"  ></el-option> -->
            <el-option v-for="(item,index) in riskCodes" :key="index" :label="item.codeType1" :value="item.codeEname1"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-select size="small" clearable style="width:150px;" v-model="filters.status" placeholder="请选择文章状态">
            <!-- <el-option  label="全部文章状态"  value="-1"  ></el-option> -->
            <el-option label="上架" value="1"></el-option>
            <el-option label="下架" value="0"></el-option>
            <el-option label="添加待审批" value="2"></el-option>
            <el-option label="修改待审批" value="3"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-select size="small" clearable style="width:150px;" v-model="filters.type" placeholder="请选择文章类型">
            <!-- <el-option  label="全部文章类型"  value="-1"  ></el-option> -->
            <el-option label="旅行常识" value="1"></el-option>
            <el-option label="突发事件" value="2"></el-option>
            <el-option label="保险常识" value="3"></el-option>
            <el-option label="常见风险" value="4"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item style="float:right;">
          <el-button size="small" type="primary" v-show='articleExport' icon="upload2" @click="exportExcels">导出</el-button>
        </el-form-item>
        <el-form-item style="float:right;">
          <el-button size="small" type="primary" v-show='articleAdd' icon="plus" @click="handleAdd">新增</el-button>
        </el-form-item>
        <el-form-item style="float:right;">
          <el-button size="small" type="primary" v-show='articleQuery' icon="search" v-on:click="getOrders(true)">查询</el-button>
        </el-form-item>

      </el-form>
    </el-col>

    <!--列表-->
    <el-table :data="orders" border :height="winHeight-188" highlight-current-row v-loading="listLoading" @selection-change="selsChange" style="width: 100%;">
      <el-table-column prop="id" label="文章ID" align="center" width="120" sortable>
        <!--  <template scope="scope">
            <span style="color:#20a0ff;cursor:pointer;text-decoration:underline;">{{scope.row.id}}</span>
          </template> -->
      </el-table-column>
      <el-table-column prop="name" label="文章名称" width="180" show-overflow-tooltip>
      </el-table-column>
      <el-table-column prop="productName" label="产品名称" :formatter="formatProduct" width="180">
      </el-table-column>
      <el-table-column prop="riskCode" label="产品类型" width="130" :formatter="formatRisk" sortable>
      </el-table-column>
      <el-table-column prop="type" label="文章类型" min-width="180" :formatter="formatType" sortable>
      </el-table-column>
      <el-table-column prop="status" label="文章状态" width="120" :formatter="formatStatus" sortable>
      </el-table-column>
      <el-table-column prop="modifyTime" label="最近更新时间" width="180">
      </el-table-column>
      <el-table-column label="操作" fixed='right' width="150">
        <template scope="scope">
          <el-button size="small" v-show="articleDetail" @click="handleDetail(scope.$index, scope.row)">详情</el-button>
          <el-button type="warning" size="small" v-show="IsEdit(scope.$index, scope.row)" @click="handleEdit(scope.$index, scope.row)">修改</el-button>
          <el-button type="danger" size="small" :disabled="ApproveUser(scope.$index,scope.row)" v-show="IsApprove(scope.$index, scope.row)" @click="handleEdit(scope.$index, scope.row)">审批</el-button>
        </template>
      </el-table-column>
    </el-table>

    <!--工具条-->
    <el-col :span="24" class="toolbar">
      <!-- <el-button type="danger" @click="batchRemove" :disabled="this.sels.length===0">批量删除</el-button> -->
      <!-- <el-pagination layout="prev, pager, next" @current-change="handleCurrentChange" :page-size="20" :total="total" style="float:right;">
      </el-pagination> -->
      <el-pagination style="float:right" @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="page" :page-sizes="[10, 20, 40, 80]" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total">
      </el-pagination>
    </el-col>

    <!--详情界面-->
    <el-dialog title="详情" v-model="detailFormVisible" :close-on-click-modal="false">
      <el-form :model="detailForm" label-width="100px" ref="detailForm">
        <el-row>
          <el-col :xs="24" :sm="20" :md="12" :lg="12">
            <el-form-item label="名称:" prop="productCname">
              <!-- <span>{{detailForm.name}}</span> -->
              <el-input v-model="detailForm.name" :readonly="true" auto-complete="off"></el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="20" :md="12" :lg="12">
            <el-form-item label="ID:" prop="productCname">
              <!-- <span>{{detailForm.id}}</span> -->
              <el-input v-model="detailForm.id" :readonly="true" auto-complete="off"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="20" :md="12" :lg="12">
            <el-form-item label="阅读量:" prop="productCname">
              <!-- <span>{{detailForm.views}}</span> -->
              <el-input v-model="detailForm.views" :readonly="true" auto-complete="off"></el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="20" :md="12" :lg="12">
            <el-form-item label="类型:" prop="productCname">
              <!-- <span>{{detailForm.type}}</span> -->
              <el-input v-model="detailForm.type" :readonly="true" auto-complete="off"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="20" :md="12" :lg="12">
            <el-form-item label="状态:" prop="productCname">
              <!-- <span>{{detailForm.status}}</span> -->
              <el-input v-model="detailForm.status" :readonly="true" auto-complete="off"></el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="20" :md="12" :lg="12">
            <el-form-item label="产品类型:" prop="productCname">
              <!-- <span>{{detailForm.riskCode}}</span> -->
              <el-input v-model="detailForm.riskCode" :readonly="true" auto-complete="off"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>

          <el-col :xs="24" :sm="20" :md="12" :lg="12">
            <el-form-item label="产品名称:" prop="productCname">
              <!-- <span>{{detailForm.productName}}</span> -->
              <el-input v-model="detailForm.productName" :readonly="true" auto-complete="off"></el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="20" :md="12" :lg="12">
            <el-form-item label="创建人:" prop="productCname">
              <!-- <span>{{detailForm.userId}}</span> -->
              <el-input v-model="detailForm.userId" :readonly="true" auto-complete="off"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="20" :md="12" :lg="12">
            <el-form-item label="创建时间:" prop="productCname">
              <!-- <span>{{detailForm.createDate}}</span> -->
              <el-input v-model="detailForm.createDate" :readonly="true" auto-complete="off"></el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="20" :md="12" :lg="12">
            <el-form-item label="最近修改人:" prop="productCname">
              <!-- <span>{{detailForm.modifyUser}}</span> -->
              <el-input v-model="detailForm.modifyUser" :readonly="true" auto-complete="off"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="20" :md="12" :lg="12">
            <el-form-item label="最近修改时间:" prop="productCname">
              <!-- <span>{{detailForm.modifyTime}}</span> -->
              <el-input v-model="detailForm.modifyTime" :readonly="true" auto-complete="off"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-form-item label="缩略图:">
            <img style="width:400px;" :src="detailForm.imgUrl" />
          </el-form-item>
        </el-row>
        <el-row>
          <!-- <el-form-item label=""> -->
          <el-button size="small" type="primary" @click="IsexamineShow(detailForm.id)">审批历史</el-button>
          <!-- </el-form-item> -->
        </el-row>
        <el-row v-show="examineShow" style="margin-top:10px;">
          <el-table :data="examines" border height="300" v-loading="examineLoading" highlight-current-row>
            <el-table-column prop="userId" label="审批人" min-width="120" sortable>
            </el-table-column>
            <el-table-column prop="applyUser" label="申请人" min-width="120" sortable>
            </el-table-column>
            <el-table-column prop="type" label="状态" width="120" :formatter="formatApplyStatus" sortable>
            </el-table-column>
            <el-table-column prop="approveTime" label="审批时间" min-width="180" sortable>
            </el-table-column>
            <el-table-column prop="applyTime" label="申请时间" min-width="180"  sortable>
            </el-table-column>
            <el-table-column label="操作" fixed='right' width="80">
              <template scope="scope">
                <el-button size="small" @click="handleExamine(scope.$index, scope.row)">详情</el-button>
              </template>
            </el-table-column>
          </el-table>

          <!--工具条-->
          <el-col :span="24" class="toolbar">
            <el-pagination style="float:right" @size-change="handleSizeChanges" @current-change="handleCurrentChanges" :current-page="Examinepage" :page-sizes="[10, 20, 40, 80]" :page-size="ExaminepageSize" layout="total, sizes, prev, pager, next, jumper" :total="Examinetotal">
            </el-pagination>
          </el-col>
        </el-row>
        <el-row style="margin-top:10px;">
          <!-- <el-form-item label=""> -->
          <el-button size="small" type="warning" @click="preview('detail')">预览文章</el-button>
          <!-- </el-form-item> -->
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click.native="detailFormVisible = false">取消</el-button>
      </div>
    </el-dialog>

    <!--审批详情界面-->
    <el-dialog title="审批历史详情信息" v-model="examinedetailFormVisible" :close-on-click-modal="false">
      <el-form :model="examineForm" label-width="100px" ref="examineForm">
        <!-- <el-form-item label="审批人:"> -->
        <div>
          <span>审批人:</span>
          <span class="examineFonts">{{examineForm.userId}}</span>
        </div>
        <div>
          <span>申请人:</span>
          <span class="examineFonts">{{examineForm.applyUser}}</span>
        </div>
        <div>
          <span>审批时间:</span>
          <span class="examineFonts">{{examineForm.approveTime}}</span>
        </div>
        <div>
          <span>申请时间:</span>
          <span class="examineFonts">{{examineForm.applyTime}}</span>
        </div>
        <div>
          <span>状态:</span>
          <span class="examineFonts">{{examineForm.types}}</span>
        </div>
        <div>
          <span>审批备注:</span>
          <span class="examineFonts">{{examineForm.remark}}</span>
        </div>
        <el-alert style="margin-top:10px;" title="审批内容" type="info" :closable="false">
        </el-alert>
        <div>
          <span>文章名称:</span>
          <span class="examineFonts">{{examineForm.name}}</span>
        </div>
        <div>
          <span>产品类型:</span>
          <span class="examineFonts">{{examineForm.riskCode}}</span>
        </div>
        <div>
          <span>产品:</span>
          <span class="examineFonts">{{examineForm.productName}}</span>
        </div>
        <div>
          <span>文章类型:</span>
          <span class="examineFonts">{{examineForm.type}}</span>
        </div>
        <div>
          <span>状态:</span>
          <span class="examineFonts">{{examineForm.status}}</span>
        </div>
        <div>
          <span>摘要:</span>
          <span class="examineFonts">{{examineForm.summaryInfo}}</span>
        </div>
        <div>
          <span>代码:</span>
          <span class="examineFonts">{{examineForm.content}}
            <a style="color:blue;text-decoration:underline;cursor:pointer;" v-show="contentShow" @click="contentClick">{{contentTitle}}</a>
          </span>
        </div>
        <div>
          <span>缩略图:</span>
          <span class="examineFonts">{{examineForm.imgUrl}}</span>
        </div>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click.native="examinedetailFormVisible = false">取消</el-button>
      </div>
    </el-dialog>
    <!--新增界面-->
    <el-dialog title="新增" v-model="addFormVisible" :close-on-click-modal="false">
      <el-form label-width="100px" :model="addForm" :rules="addFormRules" ref="addForm">
        <el-row>
          <el-col :xs="24" :sm="18" :md="24" :lg="24">
            <el-form-item label="文章名称:" prop="name" calss="WZname">
              <el-input v-model="addForm.name" auto-complete="off" placeholder="请输入文章名称">
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="18" :md="12" :lg="12">
            <el-form-item label="产品类型:" prop="riskCode">
              <el-select v-model="addForm.riskCode" class="otherWidth" placeholder="险种" @change="riskCodeChange(true,true)">
                <el-option v-for="(item,index) in riskCodes" :key="index" :label="item.codeType1" :value="item.codeEname1"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="18" :md="12" :lg="12">
            <el-form-item label="产品:" prop="productName">
              <!-- <el-autocomplete
                          v-model="addForm.productName"
                          style="width:100%;"
                          :fetch-suggestions="querySearchAsync"
                          placeholder="请输入产品名称"
                          @select="handleSelect"
                        >
                        </el-autocomplete> -->
              <el-select v-model="addForm.productName" class="otherWidth" placeholder="请选择产品">
                <el-option v-for="(item,index) in addproducts" :key="index" :label="item.productCname" :value="item.productCname"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="18" :md="12" :lg="12">
            <el-form-item label="文章类型:" prop="type">
              <el-select v-model="addForm.type" class="otherWidth" placeholder="请选择文章类型">
                <el-option label="旅行常识" value="1"></el-option>
                <el-option label="突发事件" value="2"></el-option>
                <el-option label="保险常识" value="3"></el-option>
                <el-option label="常见风险" value="4"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="18" :md="12" :lg="12">
            <el-form-item label="状态:" prop="status">
              <el-select v-model="addForm.status" class="otherWidth" placeholder="请选择文章状态">
                <el-option label="上架" value="1"></el-option>
                <el-option label="下架" value="0"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="摘要:">
          <el-input v-model="addForm.summaryInfo" auto-complete="off" placeholder="请输入摘要">
          </el-input>
        </el-form-item>
        <el-form-item label="代码:" prop="content">
          <el-input type="textarea" :rows="4" placeholder="请输入内容" v-model="addForm.content">
          </el-input>
        </el-form-item>
        <el-form-item label="缩略图:">
          <el-upload class="upload-demo" :action="picURL" :on-success="handleSuccessDetailUrl" :on-remove="handleRemoveDetailUrl" :file-list="fileList1imgUrl" list-type="picture" :data="{parampath:articlepicture}">
            <el-button size="small" type="primary">点击上传</el-button>
          </el-upload>
        </el-form-item>
        <el-form-item label="">
          <el-button size="small" type="warning" @click="preview('add')">预览文章</el-button>
        </el-form-item>

      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click.native="addFormVisible = false">取消</el-button>
        <el-button type="primary" @click.native="addSubmit" :loading="addLoading">提交</el-button>
      </div>
    </el-dialog>

    <!-- 修改 -->
    <el-dialog :title="Atitle" v-model="editFormVisible" :close-on-click-modal="false">
      <el-form :model="editForm" label-width="120px" :rules="editFormRules" ref="editForm">
        <el-row>
          <el-col :xs="24" :sm="18" :md="24" :lg="24">
            <el-form-item label="文章名称:" prop="name" calss="WZname">
              <el-input v-model="editForm.name" :disabled="EditStatus" color="red" :style="highlight('name')" auto-complete="off" placeholder="请输入文章名称">
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="18" :md="12" :lg="12">
            <el-form-item label="产品类型:" prop="riskCode">
              <el-select v-model="editForm.riskCode" class="otherWidth" :disabled="EditStatus" :style="highlight('riskCode')" placeholder="险种" @change="riskCodeChange(false,true)">
                <el-option v-for="(item,index) in riskCodes" :key="index" :label="item.codeType1" :value="item.codeEname1"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="18" :md="12" :lg="12">
            <el-form-item label="产品:" prop="productName">
              <el-select v-model="editForm.productName" class="otherWidth" :disabled="EditStatus" :style="highlight('productName')" placeholder="请选择产品">
                <el-option v-for="(item,index) in editproducts" :key="index" :label="item.productCname" :value="item.productCname"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="18" :md="12" :lg="12">
            <el-form-item label="文章类型:" prop="type">
              <el-select v-model="editForm.type" class="otherWidth" :disabled="EditStatus" :style="highlight('type')" placeholder="请选择文章类型">
                <el-option label="旅行常识" value="1"></el-option>
                <el-option label="突发事件" value="2"></el-option>
                <el-option label="保险常识" value="3"></el-option>
                <el-option label="常见风险" value="4"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="18" :md="12" :lg="12">
            <el-form-item label="状态:" prop="status">
              <el-select v-model="editForm.status" class="otherWidth" :disabled="EditStatus" :style="highlight('status')" placeholder="请选择文章状态">
                <el-option label="上架" value="1"></el-option>
                <el-option label="下架" value="0"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="摘要:">
          <el-input v-model="editForm.summaryInfo" :disabled="EditStatus" :style="highlight('summaryInfo')" auto-complete="off" placeholder="请输入摘要">
          </el-input>
        </el-form-item>
        <el-form-item label="代码:" prop="content">
          <el-input type="textarea" :rows="4" placeholder="请输入内容" v-model="editForm.content" :disabled="EditStatus" :style="highlight('content')">
          </el-input>
        </el-form-item>
        <el-form-item label="缩略图:">
          <el-upload class="upload-demo" 
              :action="picURL" 
              :on-success="editSuccessDetailUrl" 
              :on-remove="editRemoveDetailUrl" 
              :file-list="fileList2imgUrl" 
              list-type="picture" 
              :disabled="EditStatus" 
              :data="{parampath:articlepicture}">
            <el-button size="small" v-show="!EditStatus" :style="highlight('imgUrl')" type="primary">点击上传</el-button>
          </el-upload>
        </el-form-item>
        <el-row v-show="EditStatus">
          <el-col :xs="24" :sm="20" :md="12" :lg="12">
            <el-form-item label="创建人:" prop="productCname">
              <span>{{createuser}}</span>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="20" :md="12" :lg="12">
            <el-form-item label="创建时间:" prop="productCname">
              <span>{{createDate}}</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row v-show="EditStatus">
          <el-col :xs="24" :sm="20" :md="12" :lg="12">
            <el-form-item label="修改人:" prop="productCname">
              <span>{{approveuser}}</span>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="20" :md="12" :lg="12">
            <el-form-item label="修改时间:" prop="productCname">
              <span>{{approveTime}}</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row v-show="EditStatus">
          <el-form-item label="审批备注:">
            <el-input type="textarea" v-model="approveRemark" auto-complete="off"></el-input>
          </el-form-item>
        </el-row>
        <el-row>
          <el-form-item label="">
            <el-button size="small" type="warning" @click="preview('edit')">预览文章</el-button>
          </el-form-item>
        </el-row>

      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click.native="editCancel">{{cancel}}</el-button>
        <el-button type="primary" @click.native="editSubmit" :loading="editLoading">{{submit}}</el-button>
      </div>
    </el-dialog>

    <!-- 二维码预览 -->
    <el-dialog size="tiny" v-model="qrcodeVisible" align="center" :close-on-click-modal="false">
      <el-row>
        <div id="qrcode" style="width:240px; height:240px;">

        </div>
      </el-row>
    </el-dialog>
    <!-- 审批 -->
    <!-- <el-dialog title="审批"  v-model="approveVisible"  :close-on-click-modal="false">
        <el-form :model="approveForm"  label-width="120px" ref="approveForm">
                <el-row>
                <el-col :xs="24" :sm="18" :md="24" :lg="24">
                  <el-form-item label="文章名称:" prop="serialNumber">
                      <el-input v-model="approveForm.name" color="red" calss="mystyle" auto-complete="off" placeholder="请输入文章名称">
                      </el-input>
                  </el-form-item>
                </el-col>
                </el-row>
                <el-row>
                <el-col :xs="24" :sm="18" :md="12" :lg="12">
                  <el-form-item label="产品类型:" prop="kindCode">
                      <el-select v-model="approveForm.riskCode" placeholder="险种" @change="riskCodeChange(false)">
                        <el-option v-for="item in riskCodes" :label="item.codeType1"  :value="item.codeEname1"  ></el-option>
                      </el-select>
                  </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="18" :md="12" :lg="12">
                  <el-form-item label="产品:" prop="clauseTitle">
                        <el-select v-model="approveForm.productName" placeholder="请选择产品">
                        <el-option v-for="item in editproducts" :label="item.productCname"  :value="item.id"  ></el-option>
                        </el-select>
                  </el-form-item>
                </el-col>
                </el-row>
                <el-row>
                <el-col :xs="24" :sm="18" :md="12" :lg="12">
                  <el-form-item label="文章类型:" prop="name">
                      <el-select v-model="approveForm.type" placeholder="请选择文章类型">
                        <el-option  label="旅行常识"  value="1"  ></el-option>
                        <el-option  label="突发事件"  value="2"  ></el-option>
                        <el-option  label="保险常识"  value="3"  ></el-option>
                        <el-option  label="常见风险"  value="4"  ></el-option>
                      </el-select>
                  </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="18" :md="12" :lg="12">
                  <el-form-item label="状态:" prop="name">
                      <el-select v-model="approveForm.status" placeholder="请选择文章状态">
                        <el-option  label="上架"  value="1"  ></el-option>
                        <el-option  label="下架"  value="0"  ></el-option>
                      </el-select>
                  </el-form-item>
                </el-col>
                </el-row>
              <el-form-item label="摘要:">
                  <el-input v-model="approveForm.content" auto-complete="off" placeholder="请输入摘要">
                  </el-input>
              </el-form-item>
              <el-form-item label="代码:">
                  <el-input
                    type="textarea"
                    :rows="2"
                    placeholder="请输入内容"
                    v-model="approveForm.Abstract">
                  </el-input>
              </el-form-item>
              <el-form-item label="缩略图:"  prop="name">
                  <el-upload
                    class="upload-demo"
                    :action="picURL"
                    :on-success="editSuccessDetailUrl"
                    :on-remove="editRemoveDetailUrl"
                    :file-list="fileList2imgUrl"
                    list-type="picture">
                    <el-button size="small" type="primary">点击上传</el-button>
                  </el-upload>
              </el-form-item>
              <el-form-item label=""  prop="name">
              <el-button size="small" type="warning">预览文章</el-button>
              </el-form-item>

        </el-form>
        <div slot="footer" class="dialog-footer">
            <el-button @click.native="approveFormVisible = false">取消</el-button>
            <el-button type="primary" @click.native="approveSubmit" :loading="approveLoading">提交</el-button>
        </div>
     </el-dialog>
 -->
    <el-dialog :title="previewTitle" size="large" v-model="editorVisible" :close-on-click-modal="false">
      <editor ref="myTextEditor" v-show="examineprevieweditor" :fileName="'myFile'" :uploadUrl="uploadUrl" v-model="content">
      </editor>
      <div id="examinepreview" style="width:100%;">

      </div>
      <div slot="footer" class="dialog-footer">
        <el-button @click.native="editorVisible = false">取消</el-button>
        <el-button type="primary" v-show="editorShow" @click.native="editorSubmit(Isaddedit)" :loading="editorLoading">确定</el-button>
      </div>
    </el-dialog>

  </section>
</template>

<script>
import util from '../../common/js/util'
import commons from '../../common/js/common'

//import NProgress from 'nprogress'
import { mapState, mapActions } from 'vuex'
import { articleList, picURL, addOrUpdateArticle, productByRisk, approve, base, approveHis } from '../../api/api';
import editor from '../../components/Quilleditor.vue'
import QRCode from 'qrcodejs2'
export default {
  components: {
    editor
  },
  data() {
    return {
      uploadUrl: base + '/cxb/admin/uploadWeb/upload',
      content: '',
      articlepicture: '',
      Isaddedit: '',
      restaurants: [],
      filters: {
        name: '',
        productName: '',
        status: '',
        riskCode: '',
        type: ''
      },
      previewId: '',
      ExamineId: '',
      originalStatus: '',
      picURL: picURL,
      riskCodes: [],
      addproducts: [],
      editproducts: [],
      // Codelist:'',
      examineShow: false,//审批历史显示
      editorShow: true,
      examineprevieweditor: true,
      addFormVisible: false,//显示新增
      detailFormVisible: false,//显示详情
      editFormVisible: false,//显示修改
      approveVisible: false,//显示审批
      listLoading: false,
      editLoading: false,
      addLoading: false,
      editorLoading: false,
      editorVisible: false,
      examinedetailFormVisible: false,
      examineLoading: false,
      qrcodeVisible: false,
      exportTotal: 0,
      articleAdd: false,
      articleApprove: false,
      articleDetail: false,
      articleExport: false,
      articleQuery: false,
      articleUpdate: false,

      previewTitle: '修改',
      Atitle: '修改',
      cancel: '取消',
      submit: '提交',
      contentTitle: '展开',
      EditStatus: false,
      contentShow: false,
      defaultcontent: '',
      approveuser: '',
      approveTime: '',
      createuser: '',
      createDate: '',
      approveId: '',
      approveRemark: '',
      lists: [],
      fileList1imgUrl: [],
      fileList2imgUrl: [],
      editData: {},
      approveData: {},
      loading: '',
      examineForm: {

      },
      detailForm: {
        id: '',
        name: '',
        riskCode: '',
        productName: '',
        type: '',
        status: '',
        content: '',
        userId: '',
        createDate: '',
        Abstract: '',
        summaryInfo: '',
        imgUrl: ''
      },
      addForm: {
        name: '',
        riskCode: '',
        productId: '',
        productName: '',
        type: '',
        status: '',
        content: '',
        Abstract: '',
        summaryInfo: '',
        imgUrl: ''
      },
      editForm: {
        id: '',
        name: '',
        riskCode: '',
        productId: '',
        productName: '',
        type: '',
        status: '',
        content: '',
        Abstract: '',
        summaryInfo: '',
        imgUrl: '',
        // modifyTime:''
      },
      approveForm: {
        id: '',
        name: '',
        riskCode: '',
        productId: '',
        productName: '',
        type: '',
        status: '',
        content: '',
        Abstract: '',
        imgUrl: ''
      },
      addFormRules: {
        name: [
          { required: true, message: '请输入文章名称', trigger: 'blur' }
        ],
        riskCode: [
          { required: true, message: '请选择产品类型', trigger: 'blur' }
        ],
        productName: [
          { required: true, message: '请选择产品', trigger: 'blur' }
        ],
        type: [
          { required: true, message: '请选择文章类型', trigger: 'blur' }
        ],
        status: [
          { required: true, message: '请选择文章状态', trigger: 'blur' }
        ],
        content: [
          { required: true, message: '请输入代码', trigger: 'blur' }
        ]

      },
      editFormRules: {
        name: [
          { required: true, message: '请输入文章名称', trigger: 'blur' }
        ],
        riskCode: [
          { required: true, message: '请选择产品类型', trigger: 'blur' }
        ],
        productName: [
          { required: true, message: '请选择产品', trigger: 'blur' }
        ],
        type: [
          { required: true, message: '请选择文章类型', trigger: 'blur' }
        ],
        status: [
          { required: true, message: '请选择文章状态', trigger: 'blur' }
        ],
        content: [
          { required: true, message: '请输入代码', trigger: 'blur' }
        ]
      },
      orders: [],
      examines: [],
      total: 0,
      Examinetotal: 0,
      Examinepage: 1,
      ExaminepageSize: 10,
      page: 1,
      pageSize: 10,
      listLoading: false,
      sels: []//列表选中列
    }
  },
  computed: mapState({
    user: 'user',
    clist: 'riskCodelist',
    blist: 'branchCodelist',
    plist: 'productList',
    Tourl: 'skipUrl',
    IsFirstURl: 'IsFirstURl',
    winHeight: 'winHeight'
  }),
  methods: {
    ...mapActions([
      'CodeList', 'editIsfirst', 'ProductList'
    ]),
    //险种编码转换
    formatRisk: function (row, column) {
      return commons.CodeName(this.clist, row.riskCode, 'RiskCode');
    },
    //时间
    formatTime: function (row, column) {
      return commons.getDaytime(row.modifyTime, 1, false);
    },
    //审批时间
    formatApproveTime: function (row, column) {
      return commons.getDaytime(row.approveTime, 1, false);
    },
    //申请时间
    formatApplyTime: function (row, column) {
      return commons.getDaytime(row.applyTime, 1, false);
    },
    //文章类型
    formatType: function (row, column) {
      return commons.articleType(row.type);
    },
    //文章状态
    formatStatus: function (row, column) {
      return commons.articleStatus(row.status);
    },
    //产品名称
    formatProduct: function (row, column) {
      for (var i in this.plist) {
        if (parseInt(this.plist[i].id) == parseInt(row.productId)) {
          return this.plist[i].productCname;
        }
      }
    },
    //审批状态
    formatApplyStatus: function (row, column) {
      return row.status == "0" ? "待审批" : (row.status == "1" ? "通过" : "不通过");
    },
    contains: function (arr, obj) {
      var i = arr.length;
      while (i--) {
        if (arr[i] === obj) {
          return true;
        }
      }
      return false;
    },
    IsexamineShow: function (id) {
      if (!this.examineShow) {
        this.getExamine();
      }
      this.examineShow = !this.examineShow;


    },
    //展开，收起
    contentClick() {
      if (this.contentTitle == '展开') {
        this.contentTitle = '收起';
        this.examineForm.content = this.defaultcontent;
      }
      else {
        this.contentTitle = '展开';
        this.examineForm.content = this.defaultcontent.substring(0, 100);
      }
    },
    //审批详情
    handleExamine(index, row) {
      this.examineForm = {};
      this.contentShow = false;
      var data = JSON.parse(row.content);
      this.examinedetailFormVisible = true;
      this.examineForm = JSON.parse(row.content);
      this.examineForm.userId = row.userId;
      this.examineForm.applyUser = row.applyUser;
      this.examineForm.remark = row.remark;
      this.examineForm.riskCode = commons.CodeName(this.clist, data.riskCode, "RiskCode");
      this.examineForm.status = commons.articleStatus(data.status);
      this.examineForm.type = commons.articleType(data.type);
      this.examineForm.types = row.status == "0" ? "待审批" : (row.status == "1" ? "通过" : "不通过");
      this.examineForm.approveTime = row.approveTime;
      this.examineForm.applyTime = row.applyTime;
      this.defaultcontent = data.content;
      if (data.content.length > 100) {
        this.examineForm.content = data.content.substring(0, 100);
        this.contentShow = true;
      }
    },
    //预览
    preview(str) {

      this.content = '';
      this.Isaddedit = str;
      this.examineprevieweditor = true;
      var protocol = location.protocol;
      var hostname = location.hostname;
      $('#examinepreview').html('');
      if (str == 'add') {
        this.previewTitle = '预览',
          this.editorVisible = true;
        this.content = this.addForm.content;
        this.editorShow = true;
      }
      else if (str == 'edit') {
        // this.editorVisible = true;
        // this.previewTitle = '预览',
        // this.content = this.editForm.content;
        // this.editorShow = true;
        // if(this.EditStatus){
        //   this.editorShow = false;
        //   this.examineprevieweditor = false;
        //   this.$nextTick(function () {
        //     $('#examinepreview').html(this.editForm.content);
        //   });

        // }

        this.qrcodeVisible = true;
        $('#qrcode').html('');
        this.$nextTick(function () {
          var qrcode = new QRCode('qrcode', {
            width: 240,
            height: 240,
            colorDark: '#20a0ff',
            colorLight: '#ffffff',
            correctLevel: QRCode.CorrectLevel.H
          });
          // qrcode.makeCode(protocol+'//'+hostname+'/admin-cxb/articlePreview.html?ID='+this.previewId);
          qrcode.makeCode(protocol + '//' + hostname + '/sticcxb/#/sticcxb/softPaper?soft=' + this.previewId);
        });

      }
      else if (str == 'detail') {
        // this.content = this.detailForm.content;
        // this.editorShow = false;
        this.qrcodeVisible = true;
        $('#qrcode').html('');
        this.$nextTick(function () {
          var qrcode = new QRCode('qrcode', {
            width: 240,
            height: 240,
            colorDark: '#20a0ff',
            colorLight: '#ffffff',
            correctLevel: QRCode.CorrectLevel.H
          });
          // qrcode.makeCode(protocol+'//'+hostname+'/admin-cxb/articlePreview.html?ID='+this.previewId);
          qrcode.makeCode(protocol + '//' + hostname + '/sticcxb/#/sticcxb/softPaper?soft=' + this.previewId);
        });
      }
      this.$store.commit('EDITORPICTURE_VALUE', this.articlepicture);
    },
    IsEdit(index, row) {
      if (this.articleUpdate) {
        return row.tbSpApprove ? false : true;
      } else {
        return false;
      }
    },
    IsApprove(index, row) {
      if (this.articleApprove) {
        return row.tbSpApprove ? true : false;
      } else {
        return false;
      }
    },
    //审批权限
    ApproveUser(index,row) {
      var approveAuth = row.approveAuth;
      var userArr = this.user.approve;
      return commons.ApproveUser(approveAuth,userArr);
    },
    initial(bool, Ischange) {
      let para = new FormData();
      if (bool) {
        para.append('riskCode', this.addForm.riskCode);
        // Ischange? this.addForm.productName = '': null;
        // this.addForm.productName = '';
      }
      else {
        para.append('riskCode', this.editForm.riskCode);
        // Ischange? this.editForm.productName = '': null;
      }
      productByRisk(para).then((res) => {
        if (res.data.success) {
          if (bool) {
            this.addproducts = res.data.result;
          }
          else {
            this.editproducts = res.data.result;
          }
        }
      }).catch(() => {

      });
    },
    riskCodeChange(bool, Ischange) {
      this.initial(bool, Ischange);
    },
    querySearchAsync(queryString, cb) {
      var restaurants = this.restaurants;
      var results = queryString ? restaurants.filter(this.createStateFilter(queryString)) : restaurants;

      clearTimeout(this.timeout);
      this.timeout = setTimeout(() => {
        cb(results);
      }, 1000);
    },
    createStateFilter(queryString) {
      return (state) => {
        return (state.value.indexOf(queryString.toLowerCase()) != -1);
      };
    },
    //上传图片成功
    handleSuccessDetailUrl(response, file, fileList) {
      this.addForm.imgUrl = commons.SuccessUrl(this.addForm.imgUrl, file, false);
    },
    editSuccessDetailUrl(response, file, fileList) {
      this.editForm.imgUrl = commons.SuccessUrl(this.editForm.imgUrl, file, false);
    },
    handleRemoveDetailUrl(file, fileList) {
      this.addForm.imgUrl = commons.RemoveUrl(this.addForm.imgUrl, file);
    },
    editRemoveDetailUrl(file, fileList) {
      this.editForm.imgUrl = commons.RemoveUrl(this.editForm.imgUrl, file);
    },
    handleCurrentChange(val) {
      this.page = val;
      this.getOrders(true);
    },
    handleSizeChange(val) {
      this.pageSize = val;
      this.getOrders(true);
    },
    handleCurrentChanges(val) {
      this.Examinepage = val;
      this.getExamine();
    },
    handleSizeChanges(val) {
      this.ExaminepageSize = val;
      this.getExamine();
    },
    //审批历史列表
    getExamine() {
      let para = new FormData();
      para.append('pageSize', this.ExaminepageSize);
      para.append('pageNumber', this.Examinepage);
      para.append('id', this.ExamineId);
      para.append('approveType', '2');
      this.examineLoading = true;
      approveHis(para).then((res) => {
        if (res.data.success) {
          this.examines = res.data.result.content;
          this.Examinetotal = res.data.result.totalElements;
        }
        this.examineLoading = false;
      }).catch(() => {
        this.examineLoading = true;
      });
    },
    //获取文章列表
    getOrders(bool) {
      var d = new Date(this.filters.startTime);
      let para = new FormData();
      para.append("pageSize", bool ? this.pageSize : this.exportTotal);
      para.append("pageNumber", bool ? this.page : 1);
      para.append("name", this.filters.name);
      para.append("productName", this.filters.productName);
      para.append("status", this.filters.status);
      para.append("type", this.filters.type);
      para.append("riskCode", this.filters.riskCode);
      this.listLoading = bool;
      //NProgress.start();
      if (!bool) {
        this.loading = this.$loading({
          lock: true,
          text: '正在导出',
          spinner: 'el-icon-loading',
          background: 'rgba(0, 0, 0, 0.7)'
        });
      }
      articleList(para).then((res) => {
        this.riskCodes = this.clist.result;
        this.total = res.data.result.totalElements;
        this.exportTotal = res.data.result.totalElements;
        this.lists = res.data.result.content;
        this.listLoading = false;
        if (!bool) {
          this.loading.close();
          this.export2Excel();
        }
        else {
          this.orders = res.data.result.content;
          // for (var i in res.data.result.content) {
          //   this.orders[i].modifyTime = commons.getDaytime(res.data.result.content[i].modifyTime, 1, false);
          // }
        }
        //NProgress.done();
      }).catch(() => {
        if (!bool) {
          this.$message({
            message: '导出异常',
            type: 'error'
          });
          this.loading.close();
        }

      });
    },

    //table导出excel
    exportExcels: function () {
      this.getOrders(false);
    },
    export2Excel: function () {
      require.ensure([], () => {
        const { export_json_to_excel } = require('../../vendor/Export2Excel');
        const tHeader = ['文章ID', '文章名称', '产品名称', '产品类型', '文章类型', '文章状态', '最近更新时间'];
        const filterVal = ['id', 'name', 'productName', 'riskCode', 'type', 'status', 'modifyTime'];
        const list = this.lists;
        for (var i in list) {
          for (var k in this.plist) {
            if (parseInt(this.plist[k].id) == parseInt(list[i].productName)) {
              list[i].productName = this.plist[k].productCname;
            }
          }
          list[i].type = commons.articleType(list[i].type);
          list[i].status = commons.articleStatus(list[i].status);
          list[i].riskCode = commons.CodeName(this.clist, list[i].riskCode, "RiskCode");
          // list[i].modifyTime = commons.getDaytime(list[i].modifyTime, 1, false);
        }
        const data = this.formatJson(filterVal, list);
        export_json_to_excel(tHeader, data, '文章列表excel');
      })
    },
    formatJson: function (filterVal, jsonData) {
      return jsonData.map(v => filterVal.map(j => v[j]))
    },
    //显示新增界面
    handleAdd: function () {
      var nowTime = Date.parse(new Date());
      this.addFormVisible = true;
      this.fileList1imgUrl = [];
      this.addForm = {
        name: '',
        riskCode: '',
        productId: '',
        productName: '',
        type: '',
        status: '',
        content: '',
        Abstract: '',
        imgUrl: ''
      };
      this.initial(true, false);
      this.articlepicture = 'article/' + commons.getDaytime(nowTime, 3, false);
    },

    //新增提交
    addSubmit: function () {
      this.$refs.addForm.validate((valid) => {
        if (valid) {
          this.$confirm('确认提交吗？', '提示', {}).then(() => {
            this.addLoading = true;
            let para = this.addForm;
            for (var i in this.plist) {
              if (this.plist[i].productCname == this.addForm.productName) {
                this.addForm.productId = this.plist[i].id;
                break;
              }
            }
            addOrUpdateArticle(para).then((res) => {
              if (res.data.success) {
                this.$message({
                  message: '提交成功',
                  type: 'success'
                });
                this.$refs['addForm'].resetFields();
                this.addFormVisible = false;
                this.getOrders(true);
              }
              else {
                this.$message({
                  message: res.data.result,
                  type: 'error'
                });
              }
              this.addLoading = false;
              //NProgress.done();

            }).catch(() => {
              this.addLoading = false;
            });
          });
        }
      });
    },
    //详情
    handleDetail: function (index, row) {
      let _this = this;
      _this.ExamineId = row.id;
      _this.examineShow = false;
      // _this.examines = [];
      _this.detailFormVisible = true;
      _this.detailForm = Object.assign({}, row);
      _this.detailForm.id = row.id;
      _this.detailForm.type = commons.articleType(row.type);
      _this.detailForm.status = commons.articleStatus(row.status);
      _this.detailForm.riskCode = commons.CodeName(this.clist, row.riskCode, 'RiskCode');
      // _this.detailForm.createDate = commons.getDaytime(row.createDate, 1, false);
      _this.detailForm.productId = row.productId;
      _this.previewId = row.id;
      // for(var i in this.plist){
      //   if(parseInt(this.plist[i].id) == parseInt(row.productId)){
      //     _this.detailForm.productId = this.plist[i].productCname;
      //     break;
      //   }
      // }
    },
    handleEdit: function (index, row) {
      let _this = this;
      _this.previewId = row.id;
      var nowTime = Date.parse(new Date());
      _this.fileList2imgUrl = [];
      // _this.editForm.riskCode = row.riskCode;

      _this.approveId = row.id;
      function EAinitial(obj) {
        _this.fileList1imgUrl = [];
        var URL1;
        _this.editFormVisible = true;
        _this.editForm = Object.assign({}, obj);
        _this.editForm.id = obj.id;
        _this.editForm.riskCode = obj.riskCode;
        _this.initial(false, false);
        for (var i in _this.plist) {
          if (_this.plist[i].productCname == obj.productName) {
            _this.editForm.productId = _this.plist[i].id;
            break;
          }
        }
        if (obj.imgUrl) {
          URL1 = obj.imgUrl.split(",");
          if (URL1.length > 0 && URL1[0] != "") {
            for (var i in URL1) {
              _this.fileList2imgUrl.push({
                name: commons.interceptName(URL1[i]),
                url: URL1[i]
              });
            }
          }
          else {
            _this.fileList2imgUrl = [];
          }
        }
        _this.editForm.productName = obj.productName;
      };

      if (row.tbSpApprove) {
        var data = JSON.parse(row.tbSpApprove.content);
        _this.Atitle = "审批";
        _this.cancel = "不同意";
        _this.submit = "同意";
        _this.approveRemark = '';
        _this.createuser = data.userId;
        // _this.createDate = commons.getDaytime(data.createDate, 1, false);
        _this.approveuser = data.modifyUser;
        // _this.approveTime = commons.getDaytime(data.modifyTime, 1, false);
        _this.originalStatus = row.tbSpApprove.originalStatus;
        _this.EditStatus = true;
        _this.editData = row;
        _this.approveData = data;
        EAinitial(data);
      }
      else {
        _this.Atitle = "修改";
        _this.cancel = "取消";
        _this.submit = "提交";
        _this.EditStatus = false;
        _this.editData = row;
        _this.approveData = null;
        EAinitial(row);
      }
      _this.articlepicture = 'article/' + commons.getDaytime(nowTime, 3, false);
    },
    highlight: function (str) {
      let _this = this;
      var style = {
        'border-width': '1px',
        'border-style': 'solid',
        'border-color': '#FF6600',
        'border-radius': '4px'
      };
      if (_this.approveData && _this.approveData != null) {
        if (_this.approveData[str] != _this.editData[str]) {
          if (_this.approveData[str] != "" && _this.editData[str] != null) {
            if (str == 'status') {
              if (_this.originalStatus != _this.approveData[str]) {
                return style;
              }
            }
            else {
              return style;
            }
          }
        }
      }
    },
    editSubmit: function () {
      this.$refs.editForm.validate((valid) => {
        if (valid) {
          this.$confirm('确认提交吗？', '提示', {}).then(() => {
            this.editLoading = true;
            //NProgress.start();

            if (this.EditStatus) {
              let para = new FormData();
              para.append('type', 'yes');
              para.append('id', this.approveId);
              para.append('remark', this.approveRemark);
              para.append('approveType', '2');
              approve(para).then((res) => {
                if (res.data.success) {
                  this.$message({
                    message: '审批成功',
                    type: 'success'
                  });
                  this.editLoading = false;
                  this.$refs['editForm'].resetFields();
                  this.editFormVisible = false;
                  this.getOrders(true);
                }
                else {
                  this.editLoading = false;
                  this.$message({
                    message: res.data.result,
                    type: 'error'
                  });
                  this.editFormVisible = false;
                }
              });
            }
            else {
              this.editForm.modifyTime = Date.parse(new Date());
              for (var i in this.plist) {
                if (this.plist[i].productCname == this.editForm.productName) {
                  this.editForm.productId = this.plist[i].id;
                  break;
                }
              }
              let para = this.editForm;
              addOrUpdateArticle(para).then((res) => {
                if (res.data.success) {
                  this.editLoading = false;
                  //NProgress.done();
                  this.$message({
                    message: '提交成功',
                    type: 'success'
                  });
                  this.$refs['editForm'].resetFields();
                  this.editFormVisible = false;
                  this.getOrders(true);
                }
                else {
                  this.editLoading = false;
                  this.$message({
                    message: res.data.result,
                    type: 'error'
                  });
                  this.editFormVisible = false;
                }
              }).catch(() => {
                this.editLoading = false;
              });
            }

          });
        }
      });
    },
    editCancel: function () {
      if (this.EditStatus) {
        let para = new FormData();
        para.append('type', 'no');
        para.append('id', this.approveId);
        para.append('approveType', '2');
        approve(para).then((res) => {
          if (res.data.success) {
            this.$message({
              message: '提交成功',
              type: 'success'
            });
            this.$refs['editForm'].resetFields();
            this.editFormVisible = false;
            this.getOrders(true);
          }
          else {
            this.editLoading = false;
            this.$message({
              message: res.data.result,
              type: 'error'
            });
            this.editFormVisible = false;
          }
        });
      }
      else {
        this.editFormVisible = false;
      }
    },
    //预览提交
    editorSubmit: function (value) {
      value == 'add' ? this.addForm.content = this.$refs.myTextEditor.content : this.editForm.content = this.$refs.myTextEditor.content;

      this.editorVisible = false;
    },
    //审批
    handleApprove: function (index, row) {

    },
    selsChange: function (sels) {
      this.sels = sels;
    },

    beforeMount() {
    },
    btnShow: function () {
      let thisData = JSON.parse(sessionStorage.getItem('156'));
      let _this = this;
      $.each(thisData, function (i, j) {
        if (thisData[i] == "articleAdd") {
          _this.articleAdd = true;
        }
        if (thisData[i] == "articleApprove") {
          _this.articleApprove = true;
        }
        if (thisData[i] == "articleDetail") {
          _this.articleDetail = true;
        }
        if (thisData[i] == "articleExport") {
          _this.articleExport = true;
        }
        if (thisData[i] == "articleQuery") {
          _this.articleQuery = true;
        }
        if (thisData[i] == "articleUpdate") {
          _this.articleUpdate = true;
        }
      });
    },
    created() {
      let _this = this;
      // if(this.IsFirstURl){

      // }
      // else{

      // _this.$router.replace('/index');


      // }
      // this.editIsfirst();
      // this.$router.push({ path: this.Tourl });
      // this.$router.replace('..'+this.Tourl);
    },
  },
  mounted() {
    this.getOrders(true);
    this.ProductList('');
    this.btnShow();
    // this.$nextTick(function () {

    // })
    // this.CodeList('RiskCode');
    // this.CodeList('BranchCode');
  }
}

</script>

<style scoped>
/* .el-select {
    width: 135px;
  }*/
/*  .mystyle .el-input__inner{
    background-color: #000 !important;
  }*/
.highlight {
  border: 1px #ff6600 solid;
  border-radius: 4px;
}
.WZname .el-input__inner {
  background-color: #000 !important;
}
.toolbar {
  padding-bottom: 10px !important;
}
.toolbar .el-form-item {
  margin-bottom: 0px;
}
.examineFonts {
  width: 100%;
  word-wrap: break-word;
}
/*  .el-input__inner{
    background-color: #000 !important;
  }*/
</style>